import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Form, Input, Button, Card } from 'antd';

const FormItem = Form.Item;


@connect()
@Form.create()
export default class ChangeMasterPwd extends PureComponent {
  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        this.props.dispatch({
          type: 'masterManage/changeMasterPwd',
          payload: {
            id: this.props.masterInfo.id,
            loginPassword: values.loginPassword,
          },
          callback: () => {
            this.props.handleChangePwdModal();
          },
        });
      }
    });
  }
  render() {
    const { getFieldDecorator, getFieldValue } = this.props.form;
    const { masterInfo } = this.props;
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
        md: { span: 10 },
      },
    };

    const submitFormLayout = {
      wrapperCol: {
        xs: { span: 24, offset: 0 },
        sm: { span: 10, offset: 7 },
      },
    };
    return (
      <Card bordered={false}>
        <Form
          onSubmit={this.handleSubmit}
          style={{ marginTop: 8 }}
        >
          <FormItem
            {...formItemLayout}
            label="师傅账号"
          >
            {getFieldDecorator('loginName', {
              initialValue: masterInfo.loginName,
              rules: [{
                required: true, message: '请输入登录密码',
              }],
            })(
              <Input disabled placeholder="请输入登录密码" />
            )}
          </FormItem>
          <FormItem
            {...formItemLayout}
            label="登录密码"
          >
            {getFieldDecorator('loginPassword', {
              rules: [{
                required: true, message: '请输入登录密码',
              }],
            })(
              <Input placeholder="请输入登录密码" />
            )}
          </FormItem>
          <FormItem {...submitFormLayout} style={{ marginTop: 32 }}>
            <Button type="primary" htmlType="submit">
              提交
            </Button>
          </FormItem>
        </Form>
      </Card>
    );
  }
}
